<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="js/jquery.min.js"></script>
    <script>
        $(function(){
            var pageNo=1;
            function doReload(){
                $.get("userSearch",{pageNo:pageNo},function (data) {
                   alert(JSON.stringify(data));
                    $("#pager").text(pageNo);
                    $t=$("#users");
                    $t.empty();
                    $.each(data.data,function (i,e) {
                        $t.append("<tr><td>"+e.id+"</td><td>"+e.name+"</td><td>"+e.userName+"</td><td>"+e.telephone+"</td><td>"+e.unit+"</td></tr>");
                    });
                });
            }
            doReload();
            $("#prev").click(function(){
                pageNo--;
                doReload();
            });
            $("#next").click(function(){
                pageNo++;
                doReload();
            });
        });
    </script>
</head>
<body>
<table border="1" cellpadding="0" cellspacing="0" id="users">

</table>
<p align="center">
    <a href="#" id="prev">prev</a>
    <span id="pager"></span>
    <a href="#" id="next">next</a>
</p>
</body>
</html>